<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    
    <title>JavaScript Toolkit for Rich Web Mapping Applications &mdash; GeoExt v1.0</title>
    <link rel="stylesheet" href="_static/geoext.css" type="text/css" />
    <link rel="stylesheet" href="_static/pygments.css" type="text/css" />
    <script type="text/javascript">
      var DOCUMENTATION_OPTIONS = {
        URL_ROOT:    '#',
        VERSION:     '1.0',
        COLLAPSE_MODINDEX: false,
        FILE_SUFFIX: '.html',
        HAS_SOURCE:  true
      };
    </script>
    <script type="text/javascript" src="_static/jquery.js"></script>
    <script type="text/javascript" src="_static/doctools.js"></script>
    <link rel="shortcut icon" href="_static/favicon.ico"/>
    <link rel="top" title="GeoExt v1.0" href="#" />
    <link rel="next" title="Documentation" href="docs.html" />
    
    <script type="text/javascript" src="http://extjs.cachefly.net/ext-3.2.1/adapter/ext/ext-base.js"></script>
    <script type="text/javascript" src="http://extjs.cachefly.net/ext-3.2.1/ext-all.js"></script>
    <script type="text/javascript" src="http://openlayers.org/api/2.10/OpenLayers.js"></script>
    <script src="_static/GeoExt.js"></script>
    <script src="_static/front-page.js"></script>
    
    
    
    
    

  </head>
  <body>
    <div class="header">
        <div class="wrap">
            <h1 id="logo"><a href="#">GeoExt</a></h1>
            <ul id="top-nav">
                <li class="first"><a href="docs.html">Documentation</a></li>
                <li><a href="examples.html">Examples</a></li>
                <li><a href="downloads.html">Download</a></li>
                <li><a href="http://trac.geoext.org/">Development</a></li>
            </ul>
            <div id="searchbox">
                <form class="search" action="search.html" method="get">
                    <input id="searchbox-query" type="text" name="q" size="25" value="Search &hellip;" tabindex="3" onblur="if(this.value=='') this.value='Search &hellip;';" onfocus="if(this.value=='Search &hellip;') this.value='';" />
                    <input id="searchbox-submit" type="image" value="Search" src="_static/img/search_icon_green.png" />
                    <input type="hidden" name="check_keywords" value="yes" />
                    <input type="hidden" name="area" value="default" />
                </form>
            </div>
        </div>
    </div>


    <div class="sphinxsidebar">
        <div class="sphinxsidebarwrapper">
            <h1>Download</h1>
            <p>Current release: <a href="downloads.html">1.0</a></p>
            <h1>GeoExt News</h1>
            <script charset="ISO-8859-1" src="http://landmark-project.com/feed2js/feed2js.php?src=http%3A%2F%2Fgeoext.blogspot.com%2Ffeeds%2Fposts%2Fdefault%3Falt%3Drss&num=3&desc=75"></script>
            <span><a href="http://geoext.blogspot.com" title="GeoExt Blog">more ...</a></span>
        </div>
    </div>


    <div class="document">
      <div class="documentwrapper">
        <div class="bodywrapper">
          <div class="body">
            
  <div class="section" id="javascript-toolkit-for-rich-web-mapping-applications">
<h1>JavaScript Toolkit for Rich Web Mapping Applications<a class="headerlink" href="#javascript-toolkit-for-rich-web-mapping-applications" title="Permalink to this headline">¶</a></h1>
<p>GeoExt brings together the geospatial know how of
<a class="reference external" href="http://openlayers.org">OpenLayers</a> with the user interface savvy of <a class="reference external" href="http://www.sencha.com/products/js/">Ext JS</a> to help you build powerful desktop style GIS apps on
the web with JavaScript.</p>
<p><a class="reference external" href="./docs.html">Documentation</a> |
<a class="reference external" href="examples.html#examples"><em>Examples</em></a> |
<a class="reference external" href="./downloads.html">Download</a> |
<a class="reference external" href="http://trac.geoext.org/">Development</a></p>
<div class="section" id="using-geoext">
<h2>Using GeoExt<a class="headerlink" href="#using-geoext" title="Permalink to this headline">¶</a></h2>
<p>See GeoExt in action.</p>
<div class="execute highlight-javascript"><div class="highlight"><pre><span class="k">new</span> <span class="nx">Ext</span><span class="p">.</span><span class="nx">Window</span><span class="p">({</span>
    <span class="nx">title</span><span class="o">:</span> <span class="s2">&quot;GeoExt in Action&quot;</span><span class="p">,</span>
    <span class="nx">height</span><span class="o">:</span> <span class="mi">280</span><span class="p">,</span> <span class="nx">width</span><span class="o">:</span> <span class="mi">450</span><span class="p">,</span> <span class="nx">layout</span><span class="o">:</span> <span class="s2">&quot;fit&quot;</span><span class="p">,</span>
    <span class="nx">items</span><span class="o">:</span> <span class="p">[{</span>
        <span class="nx">xtype</span><span class="o">:</span> <span class="s2">&quot;gx_mappanel&quot;</span><span class="p">,</span>
        <span class="nx">layers</span><span class="o">:</span> <span class="p">[</span><span class="k">new</span> <span class="nx">OpenLayers</span><span class="p">.</span><span class="nx">Layer</span><span class="p">.</span><span class="nx">WMS</span><span class="p">(</span>
            <span class="s2">&quot;Global Imagery&quot;</span><span class="p">,</span> <span class="s2">&quot;http://maps.opengeo.org/geowebcache/service/wms&quot;</span><span class="p">,</span>
            <span class="p">{</span><span class="nx">layers</span><span class="o">:</span> <span class="s2">&quot;bluemarble&quot;</span><span class="p">}</span>
        <span class="p">)],</span>
        <span class="nx">zoom</span><span class="o">:</span> <span class="mi">1</span>
    <span class="p">}]</span>
<span class="p">}).</span><span class="nx">show</span><span class="p">();</span>
</pre></div>
</div>
<p>Learn more about using GeoExt in your application by reading the
<a class="reference external" href="docs.html"><em>documentation</em></a>.</p>
</div>
<div class="section" id="geoext-is-open-source">
<h2>GeoExt is Open Source<a class="headerlink" href="#geoext-is-open-source" title="Permalink to this headline">¶</a></h2>
<p>GeoExt is available under the BSD license and is supported by a growing
community of individuals, businesses and organizations.</p>
</div>
</div>


          </div>
        </div>
      </div>
      <div class="clearer"></div>
    </div>

    <div class="footer">
      &copy; Copyright 2009-2010, GeoExt Community.
    </div>
  </body>
</html>